<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0,user-scalable=no"> -->
<title>小米帐号 - 注册</title>
<link type="text/css" rel="stylesheet" href="__PUBLIC__/Home/css/reset.css">
<link type="text/css" rel="stylesheet" href="__PUBLIC__/Home/css/layout.css">
<link type="text/css" rel="stylesheet" href="__PUBLIC__/Home/css/registerpwd.css">

</head>
<body class="zh_CN">
<div class="wrapper">
<div class="wrap">
<div class="layout">
  <div class="n-frame device-frame reg_frame" id="main_container">
    <div class="external_logo_area"><a class="milogo" href="javascript:void(0)"></a></div>
    <div class="title-item t_c">
      <h4 class="title_big30">注册小米帐号</h4>          
    </div>  
  <div><div class="regbox">
  <div class="phone_step1">
    <div class="listwrap" id="select-cycode" _region="CN" _def_method="PH">
    <form action="<{:U('User/adduser')}>" method="post" name="regForm" onsubmit="return register();">
    <div class="inputbg">
      <label class="labelbox" for="">
        <input type="text" name="username" data-type="PH" id="username" placeholder="请输入用户名" onblur="checkUser();">
        <i id="utab" style="display:block;color:;">* 请输入用户名</i>
      </label>
    </div>
    <div class="inputbg">
      <label class="labelbox" for="">
        <input type="password" name="password" id="password" data-type="PH" placeholder="请输入密码" onblur="checkpwd();">
        <i id="ptab" style="display:block;color:;">* 请输入6-12位 数字字母下划线</i>
      </label>
    </div>
    <div class="inputbg">
      <label class="labelbox" for="">
        <input type="password" name="repassword" id="repassword" data-type="PH" placeholder="请确认输入密码" onblur="checkrpwd();">
        <i id="rptab" style="display:block;color:;">* 请确认密码</i>
      </label>
    </div>
    <div class="inputbg">
      <label class="labelbox" for="">
        <input type="text" name="phone" id="phone" data-type="PH" placeholder="请输入手机号码" onblur="checkph();">
        <i id="phtab">* 请输入您的手机号码</i>
      </label>
    </div>
    
    <div class="err_tip">
      <div class="dis_box"><em class="icon_error"></em><span></span></div>
    </div>
    <div class="inputbg inputcode dis_box">
      <label class="labelbox" for="">
        <input class="code" type="text" name="icode" id="code" autocomplete="off" placeholder="图片验证码">
      </label>
      <img alt="图片验证码" title="看不清换一张" class="icode_image code-image chkcode_img" src="<{:U('User/verify')}>" onclick="this.src=this.src+'?i='+Math.random()">

    </div>
    <div class="err_tip">
      <div class="dis_box"><em class="icon_error"></em><span></span></div>
    </div>
    <div class="err_tip send-left-times">
    </div>
    <div class="fixed_bot mar_phone_dis1">
      <input class="btn332 btn_reg_1 submit-step" id="submit" type="submit" value="立即注册">
      <p class="msg">
      点击“立即注册”，即表示您同意并愿意遵守小米
      <a href="http://www.miui.com/res/doc/eula/cn.html" target="_blank" title="用户协议">用户协议</a>
      和
      <a href="http://www.miui.com/res/doc/privacy/cn.html" target="_blank" title="隐私政策">隐私政策</a>
      </p>
    </div>
    </form>
  </div>
</div>
</div>
</div>
</div>
<div id="custom_display_4" class="n-footer">  
      <div class="nf-link-area clearfix">
        <ul class="lang-select-list">
          <li><a href="javascript:void(0)" data-lang="zh_CN" class="lang-select-li current">简体</a>|</li>
          <li><a href="https://account.xiaomi.com/pass/serviceLogin?callback=http%3A%2F%2Fwww.miui.com%2Fextra.php%3Fmod%3Dxiaomi%2Fauthcallback%26followup%3Dhttp%253A%252F%252Fwww.miui.com%252Fforum.php%26sign%3DZmM0YmVmNTQ3YWE1NDVlYjc5M2ZkZGU3YTJhZWYwN2RiZDAwMDc5OQ%2C%2C&amp;sid=miuibbs&amp;_locale=zh_TW" data-lang="zh_TW" class="lang-select-li">繁体</a>|</li>
          <li><a href="https://account.xiaomi.com/pass/serviceLogin?callback=http%3A%2F%2Fwww.miui.com%2Fextra.php%3Fmod%3Dxiaomi%2Fauthcallback%26followup%3Dhttp%253A%252F%252Fwww.miui.com%252Fforum.php%26sign%3DZmM0YmVmNTQ3YWE1NDVlYjc5M2ZkZGU3YTJhZWYwN2RiZDAwMDc5OQ%2C%2C&amp;sid=miuibbs&amp;_locale=en" data-lang="en" class="lang-select-li">English</a>|</li>
          <li><a href="http://static.account.xiaomi.com/html/faq/faqList.html" target="_blank">常见问题</a></li>
        </ul>
      </div>
      <p class="nf-intro"><span>小米公司版权所有-京ICP备10046444-<a class="beian-record-link" target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802020134"><span><img src="__PUBLIC__/home/image/login/ghs.png"></span>京公网安备11010802020134号</a>-京ICP证110507号</span></p>
    </div>
<script type="text/javascript" src="__PUBLIC__/Home/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">

      function register()
      {
          if (!checkUser()) {
            return false;
          }else if(!checkpwd()){
            return false;
          }else if(!checkrpwd()){
            return false;
          }else if(!checkph()){
            return false;
          }
          return true;
      }
      //定义验证用户名的函数
        function checkUser(){
            var user = document.regForm.username.value;
            var utab = document.getElementById('utab');
            //做判断va
            if (user == '' ) {
                utab.innerHTML = '* 用户名不能为空! ';
                utab.style.color = 'red';
                return false;
            } else{

              // ajax判断用户名是否被使用
                $.ajax({
                   type: "GET",
                   url: "<{:U('User/adduser')}>",
                   data:'username='+$('#username').val(),
                   success: function(data){
                      if( data == 1 ){
                        $('#utab').html("用户名已被使用!") ;
                        $('#utab').css('color','red');
                        return false;
                      }
                    },
                });
                utab.innerHTML = '* 验证通过!';
                utab.style.color = '#0a0';
                return true;
            }
        }

        //定义验证密码的函数
        function checkpwd(){
            var pass = document.regForm.password.value;
            var ptab = document.getElementById('ptab');
            //做判断
            if (pass.match(/^(?![a-zA-Z0-9]+$)(?![^a-zA-Z/D]+$)(?![^0-9/D]+$).{6,12}$/)==null) {
                ptab.innerHTML = '* 密码不合法! 请输入6-12位 数字字母下划线';
                ptab.style.color = '#f00';
                return false;
            } else{
                ptab.innerHTML = '* 验证通过!';
                ptab.style.color = '#0a0';
                return true;
            }
        }

        //定义验证密码的函数
        function checkrpwd(){
            var pass = document.regForm.password.value;
            var repass = document.regForm.repassword.value;
            var rptab = document.getElementById('rptab');
            //做判断
            if (pass != repass || repass == '') {
                rptab.innerHTML = '* 两次密码不一致!';
                rptab.style.color = '#f00';
                return false;
            } else{
                rptab.innerHTML = '* 验证通过!';
                rptab.style.color = '#0a0';
                return true;
            }
        }

        //定义验证手机号码的函数
        function checkph(){
            var phone = document.regForm.phone.value;
            var phtab = document.getElementById('phtab');
            //做判断
            if ((phone.match(/^1((((3[4-9])|(5[0-27-9])|(8[2-478])|(78)|(47))|((3[0-2])|([58][56])|(76)|(45))|(([35]3)|(8[019])|(77))|((170)))\d{8})|(1349[0-9]{7})$/) == null) | (phone.innerHTML == '')) {
                phtab.innerHTML = '* 手机号码格式不正确!';
                phtab.style.color = '#f00';
                return false;
            } else{
                phtab.innerHTML = '* 验证通过!';
                phtab.style.color = '#0a0';
                return true;
            }
        }

</script>

</body>
</html>